<style>
    body{
        background-image:url('__PUBLIC__/img/loginbg.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        background-attachment: fixed;
        text-align:center;
        margin:0;
        padding:0;
        color:#333;
    }
    #div-back{
        width:30%;
        height:420px;
        background-color:white;
        border:1px solid #dddddd;
        border-radius:5px;
        position: fixed;
        top:20%;
        left:35%;
        opacity: 0.3;
    }
    #login-content{
        width:30%;
        height:420px;
        text-align: left;
        padding:20px 50px;
        position: fixed;
        top:20%;
        left:35%;
    }
    #login-top{
        font-size:30px;
        text-align: center;
        color:white;
    }
    .footer{
        color:#ddd;
    }
    #span-code{padding:0;}
    #img-code{
        height:30px;
        cursor:pointer;
    }
</style>
<div id="div-back"></div>
<form id="login-content" class="form">
    <div id="login-top">用户登录</div>
    <div class="form-group">
        <label>用户名</label>
        <span class="glyphicon glyphicon-user"></span>
        <input id="code" class="form-control"/>
    </div>
    <div class="form-group">
        <label>密码</label>
        <span class="fa fa-key"></span>
        <input type="password" id="pwd" class="form-control"/>
    </div>
    <div class="form-group">
        <label>验证码</label>
        <span class="fa fa-check-square-o"></span>
        <div class="input-group">
            <input id="txt-img-code" class="form-control"/>
                <span class="input-group-addon" id="span-code">
                    <img id="img-code" src="/Auth/AuthLogin/getCheckCode"/>
                </span>
        </div>
    </div>
    <div class="form-group">
        <input id="remember-user" checked="checked" type="checkbox" />
        <label for="remember-user">记住帐号</label>
        &#12288;&#12288;
        <input id="remember-pwd" checked="checked" type="checkbox" />
        <label for="remember-pwd">记住密码</label>
    </div>
    <div class="form-group">
        <button class="btn btn-primary" id="login-btn">登录</button>
        &#12288;&#12288;
        <input type="reset" class="btn btn-default" value="重置"/>
    </div>
    <div class="form-group">
        <span id="help-block-all" class="help-block"></span>
    </div>
</form>
<div class="footer navbar-fixed-bottom ">
    ©飞鱼软件
</div>
<script>

    $("#img-code").click(function(){
        var random = Math.random();
        $(this).attr("src", "/Auth/AuthLogin/getCheckCode?v="+random);
    });

    function doCheck(){
        var code = $("#code").val().trim();
        var pwd = $("#pwd").val().trim();
        var loginCode = $("#txt-img-code").val().trim();
        if(code == ""){
            setErrMsg($("#help-block-all"),"请输入用户名");
            return false;
        }
        if(pwd == ""){
            setErrMsg($("#help-block-all"),"请输入密码");
            return false;
        }
        if(loginCode == ""){
            setErrMsg($("#help-block-all"),"请输入验证码");
            return false;
        }
        return true;
    }

    function setErrMsg(obj,msg){
        $(obj).parents(".form-group").addClass("has-error");
        $(obj).parents(".form-group").find(".help-block").show();
        $(obj).parents(".form-group").find(".help-block").text(msg);
    }
</script>